/**
 * @description  : 审批人选择
 * @descriptionDetail : 审批人选择
 * @copyright    : 浙江烟草
 * @author       : mc
 * @create       : 2022-12-05 16:24:33
 */
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :is-white="false" :title="navTitle" :custom-back="goBack" style="z-index: 99999">
      <view class="nav-right-icon" v-if="tabIndex == 0">
        <text @tap="save">
          确定
        </text>
      </view>
    </theme-navbar>
    <!-- #endif -->
		<!-- #ifdef H5-WECHAT || H5-EMP -->
		<fab-button :content="fContent" @fabtrigger="fabtrigger" />
		<!-- #endif -->
    <view class="content u-page">
      <view class="select-lay">
        <u-search placeholder="请输入用户名" v-model="searchTxt" @clear="clearSearch" @custom="search"></u-search>
        <view class="sel-desc">
          已选择：
        </view>
        <view class="select-users">
          <u-tag class="u-m-r-15" type="info" :closeable="true" :text="item.personName" v-for="item in selUsers" :key="item.orgId" @close="deleteSelectUser(item)"></u-tag>
        </view>
      </view>

      <list-view
        :i="0"
        :index="0"
        :load-data="loadData"
        :init-load="false"
        :height="getListViewHeight()"
        :fixed="false"
        :justScroll="true"
        ref="mescrollItem0"
      >
        <view class="n-lay" slot-scope="d">
          <view class="item-checkbox item-content">
            <u-checkbox
              :name="d.data.personId"
              :size="50"
              shape="square"
              v-model="d.data.checked"
              @change="checkboxChange"
            >
              {{ d.data.personName }}({{ d.data.deptName }})
            </u-checkbox>
          </view>
        </view>
      </list-view>
    </view>
  </view>
</template>

<script>
	import listView from '@/components/list_view.vue';
	import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
	import commonService from "@/service/common/common.service.js";
	import fabButton from '@/components/uni-fab.vue';

	export default {
		onLoad(opt) {
			this.gfCode = opt.flowFormCode;
			this.bizId = opt.docInsUuid;
			this.needLevel = opt.needLevel == '0' ? false : true; // 是否需要level 字段作为参数

			/* 安徽特例增加扩展参数 ljb 20240423 start */
			this.extParam = this.getRouteParam();
			/* 安徽特例增加扩展参数 ljb 20240423 end */
		},
		components: {
			listView,
			fabButton
		},
		mixins: [MescrollMoreMixin, ],
		data() {
			return {
				gfCode: "",
				bizId: "",
				searchTxt: "",
				selUsers: [],
				needLevel: true,
				user: this.$store.state.userInfo,
				fContent: [{
					iconPath: require('@/static/confirm.png'),
					selectedIconPath: require('@/static/confirm.png'),
					text: '确定',
					active: false,
				}],
			}
		},
		computed: {
			selUsersStr() {
				let ar = [];
				this.selUsers.forEach(itm => {
					ar.push(itm.orgId);
				});
				return ar.join(",");
			},
		},
		mounted() {

			this.$refs['mescrollItem0'].$refs['mescrollRef0'].downHight = 0;
			this.setRightBtns();
		},
		methods: {
			setRightBtns() {
				// 设置右侧标题
				// #ifdef H5-DINGDING
				let self = this;
				this.$deviceApi.setRight("确定", () => {
					self.save();
					this.setRightBtns();
				}, true, true);
				// #endif
			},
			fabtrigger(btn) {
				if (btn.index == 0) {
					this.save();
				}
			},
			checkboxChange(e) {
				let isExit = false;
				for (let i = 0; i < this.selUsers.length; i++) {
					if (this.selUsers[i].personId == e.name) {
						this.selUsers[i].checked = e.value;
						isExit = true;
						if (!e.value) {
							this.selUsers.splice(i, 1);
						}
						break;
					}
				}
				if (!isExit && e.value) {
					let item;
					let userFlows = this.$refs['mescrollItem0'].listDatas;
					for (let i = 0; i < userFlows.length; i++) {
						if (userFlows[i].personId == e.name) {
							item = userFlows[i];
							break;
						}
					}
					if (item != undefined) {
						this.selUsers.push(item);
					}
				}

			},
			// 删除选中人员
			deleteSelectUser(ua) {
				let self = this;
				this.$modal.alert("确认删除吗？", "提示", () => {
					for (let i = 0; i < self.selUsers.length; i++) {
						if (self.selUsers[i].personId == ua.personId) {
							self.selUsers.splice(i, 1);
							let ops = this.$refs["mescrollItem0"].listDatas;
							for (let j = 0; j < ops.length; j++) {
								if (ops[j].personId == ua.personId) {
									ops[j].checked = false;
									break;
								}
							}
						}
					}
				}, "确定", true);
			},
			getListViewHeight() {
				let p = (this.$u.sys().windowHeight - 44 - uni.upx2px(180) - this.$u.sys().statusBarHeight) + "px";
				// #ifdef H5-DINGDING || H5-WECHAT
				p = uni.upx2px(180) + "px";
				// #endif
				return p;
			},
			save() {
				if (this.selUsers.length === 0) {
					this.$modal.alert("请选择人员");
					return;
				}
				this.backPrev({
					paramKey: "flowUserSelectBack",
					param: this.selUsers,
				});
			},
			search() {
				this.$refs["mescrollItem0"].getData();
			},
			clearSearch() {
				this.$refs["mescrollItem0"].getData();
			},
			loadData(page) {
				let queryParams = {};
				queryParams.gfCode = this.gfCode;
				queryParams.bizId = this.bizId || "";
				queryParams.limit = 50;
				queryParams.personName = this.searchTxt;
				queryParams.page = 1;
				if (this.needLevel) {
					queryParams.orgLevel = this.user.orgLevel;
				}
				/* 安徽特例增加扩展参数 ljb 20240423 start */
				if(!!this.extParam && !Array.isArray(this.extParam)) {
            queryParams = { ...queryParams, ...this.extParam };
				}
				/* 安徽特例增加扩展参数 ljb 20240423 end */
				
				let self = this;
				this.$modal.showLoading("加载中...");
				return new Promise((resolve, reject) => {
					commonService.flowNextPerson(queryParams).then(dr => {
						self.$modal.hideLoading();
						if (dr.success) {
							dr.data.forEach(itm => {
								if (self.selUsersStr.length > 0) {
									itm.checked = self.selUsersStr.indexOf(itm.personId) != -1;
								} else {
									itm.checked = false;
								}
							});
							resolve({
								data: {
									list: [...dr.data, ],
								},
							});
						} else {
							resolve({
								data: {
									list: [],
								},
							});
						}
					}).catch(err => {
						self.$modal.hideLoading();
						self.$modal.alert('查询失败:' + err);
						resolve({
							data: {
								list: [],
							},
						});
					});
				});
			},

		},
	}
</script>

<style scoped lang="scss">
	.n-lay {
		width: 100%;
		display: block;
		padding: 20rpx 20rpx;
		border-bottom: 1px solid $u-border-color;
	}

	.select-lay {
		padding: 20rpx 20rpx;
		border-bottom: 1px solid $u-bg-color;
	}

	.sel-desc {
		margin-top: 32rpx;
		color: #999999;
		font-size: 15px;
	}

	.select-users {
		height: 28px;
		margin-top: 30rpx;

		uni-text {
			color: #027AFF;
			background: #E6F1FF;
			width: auto;
			font-size: 15px;
			font-weight: bold;
			// border: 1px solid #1fa3ff;
			border-radius: 16px;
			padding: 3px;
			margin: 3px;
		}
	}

	.nav-right-icon {
		margin-right: 30rpx;
		font-size: .8rem;
		color: #FFF;
	}
</style>
